import React from 'react';
import { Layout, Menu } from 'antd';
import Logo from './Logo';

const { Header: AntHeader } = Layout;

const Header = ({ selectedMenu, setSelectedMenu, collapsed, }) => {
  // 主菜单数据
  const mainMenus = [
    { key: 'dashboard', label: '仪表盘' },
    { key: 'system', label: '系统管理' },
    { key: 'business', label: '业务管理' },
    { key: 'reports', label: '报表统计' }
  ];

  return (
    <AntHeader style={{ display: 'flex', alignItems: 'center', padding: 0 }}>
      <Logo collapsed={collapsed} />
      <Menu
        theme="dark"
        mode="horizontal"
        selectedKeys={[selectedMenu]}
        items={mainMenus.map(menu => ({
          key: menu.key,
          label: menu.label
        }))}
        onClick={({ key }) => setSelectedMenu(key)}
        style={{ flex: 1 }}
      />
    </AntHeader>
  );
};

export default Header;